<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>新建投票</title>
    <style>

    </style>
    <script src="https://code.highcharts.com.cn/jquery/jquery-1.8.3.min.js"></script>
</head>
<body>
<hr>
<a href="/">主页</a>
<a href="/logout">注销登录</a>
<hr>
<form action="/addVote" method="post">
    <div></div><span>截止时间</span><input type="datetime-local" name="endTime" required><br></div>
    <div><span>标题</span><input type="text" name="vote_title" required><br></div>
    <div><span>简介</span><input type="text" name="vote_content" required><br></div>
    <div id="options">

    </div>
    <input type="submit">
</form>
<button onclick="addOption()">新增选项</button>
<button onclick="removeOption()">删除选项</button>
<script>
    const template = '<div class="option" ><span>选项名称</span><input type="text" name="vote_option" required><br></div>'
    for (let i = 0; i < 3; i++) {
        $('#options').append(
            template
        )
    }
    function addOption(){
        $('#options').append(
            template
        )
    }

    function removeOption(){
        if ($('.option').length > 2)
            $('.option')[$('.option').length-1].remove()
        else
            alert("至少需要2个选项")
    }
</script>
</body>
</html>